<template>
  <div class="app-container">
    <el-form :show-message="!($route.query.isInfo || isInfo)" ref="elForm" :disabled="$route.query.isInfo || isInfo"
      :model="formData" :rules="rules" size="medium" label-width="120px">
      <h2 style="text-align: center">_年度管理评审工作计划</h2>
      <h4 class="form-header h4">基本信息</h4>
      <el-row :gutter="15">
        <el-col :span="8">
          <el-form-item label="年度" prop="auditYear">
            <el-date-picker type="year" v-model="formData.auditYear" format="yyyy" value-format="yyyy"
              :style="{ width: '100%' }" placeholder="请选择年度" clearable></el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="会议时间" prop="meetingDate">
            <el-date-picker v-model="formData.meetingDate" format="yyyy-MM-dd" value-format="yyyy-MM-dd"
              :style="{ width: '100%' }" placeholder="请选择会议时间" clearable></el-date-picker>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="地点" prop="address">
            <el-input v-model="formData.address" placeholder="请输入地点" clearable :style="{ width: '100%' }">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="主持人" prop="hostId">
            <UserDialog :disabled="$route.query.isInfo || isInfo" v-model="formData.hostId" @change="changeUserhostId">
            </UserDialog>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="协助人" prop="assistantsId">
            <UserDialog :disabled="$route.query.isInfo || isInfo" v-model="formData.assistantsId"
              @change="changeUserassistantsId"></UserDialog>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="8">
          <el-form-item label="参与人员" prop="joinId">
            <UserDialogSelection
              :disabled="$route.query.isInfo || isInfo"
              @change="changejoinId"
              placeholder="请选择参与人员"
              v-model="formData.joinId"
            ></UserDialogSelection>
          </el-form-item>
        </el-col> -->
        <el-col :span="8">
          <el-form-item label="参加人员" prop="joinId">
            <el-select multiple v-model="formData.joinId" placeholder="请选择参加人员" clearable :style="{ width: '100%' }">
              <el-option v-for="dict in dict.type.sys_user_post_type" :key="dict.value" :label="dict.label"
                :value="dict.value.toString()" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="录入时间" prop="recordTime">
            <el-date-picker v-model="formData.recordTime" format="yyyy-MM-dd" value-format="yyyy-MM-dd"
              :style="{ width: '100%' }" placeholder="请选择录入时间" clearable></el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="评审目的" prop="goal">
        <el-input v-model="formData.goal" type="textarea" placeholder="请输入评审目的" :autosize="{ minRows: 4, maxRows: 4 }"
          :style="{ width: '100%' }"></el-input>
      </el-form-item>
      <el-form-item label="评审依据" prop="basis">
        <el-input v-model="formData.basis" type="textarea" placeholder="请输入评审依据" :autosize="{ minRows: 4, maxRows: 4 }"
          :style="{ width: '100%' }"></el-input>
      </el-form-item>
      <el-form-item label="输入资料" prop="information">
        <el-input v-model="formData.information" type="textarea" placeholder="请输入资料"
          :autosize="{ minRows: 4, maxRows: 4 }" :style="{ width: '100%' }"></el-input>
      </el-form-item>
      <el-col :span="24" v-if="btnShow">
        <el-form-item label-width="0" style="text-align: center; margin-top: 30px">
          <el-button v-if="!($route.query.isInfo || isInfo)" type="primary" @click="submitForm(1)">提交</el-button>
          <el-button v-if="!($route.query.isInfo || isInfo)" type="primary" @click="submitForm(0)">暂存</el-button>
          <el-button :disabled="false" @click="resetForm">返回</el-button>
        </el-form-item>
      </el-col>
    </el-form>
  </div>
</template>

<script>
import {
  managerAuditAdd,
  updategmanagerAudit,
  managerAuditInfo,
} from "@/api/quality/manageAudit/plan.js";

export default {
  components: {},
  dicts: [
    "sys_user_post_type",
  ],
  props: {
    isInfo: {
      type: Boolean,
      default: false,
    },
    id: {
      type: String,
      default: "",
    },
    btnShow: {
      type: Boolean,
      default: true,
    },
  },
  data() {
    return {
      formData: {
        auditYear: null,
        meetingDate: null,
        goal: undefined,
        basis: undefined,
        address: undefined,
        hostId: undefined,
        assistantsId: undefined,
        joinId: undefined,
        information: undefined,
      },
      rules: {
        auditYear: [
          {
            required: true,
            message: "请选择年度",
            trigger: "change",
          },
        ],
        recordTime: [
          {
            required: true,
            message: "请选择录入时间",
            trigger: "change",
          },
        ],
        meetingDate: [
          {
            required: true,
            message: "请选择会议时间",
            trigger: "change",
          },
        ],
        goal: [
          {
            required: true,
            message: "请输入评审目的",
            trigger: "blur",
          },
        ],
        basis: [
          {
            required: true,
            message: "请输入评审依据",
            trigger: "blur",
          },
        ],
        address: [
          {
            required: true,
            message: "请输入地点",
            trigger: "blur",
          },
        ],
        hostId: [
          {
            required: true,
            message: "请输入主持人",
            trigger: "change",
          },
        ],
        assistantsId: [
          {
            required: true,
            message: "请输入协助人",
            trigger: "change",
          },
        ],
        joinId: [
          {
            required: true,
            message: "请输入参与人员",
            trigger: "blur",
          },
        ],
        information: [
          {
            required: true,
            message: "请输入资料",
            trigger: "blur",
          },
        ],
      },
    };
  },
  computed: {},
  watch: {},
  created() {
    if (this.$route.query.isEdit || this.$route.query.isInfo || this.isInfo) {
      this.getinfo();
    }
  },
  mounted() { },
  methods: {
    changeUserhostId(e) {
      this.formData.hostName = e.nickName;
    },
    changeUserassistantsId(e) {
      this.formData.assistants = e.nickName;
    },
    changejoinId(e) {
      this.formData.joinName = e.map((i) => i.nickName).toString();
    },
    getinfo() {
      return managerAuditInfo(this.$route.query.id || this.id).then(
        (response) => {
          this.formData = response.data;
          this.formData.joinId = this.formData.joinId.split(",");
          this.formData.auditYear = this.formData.auditYear.toString();

          console.log(this.formData.joinId, "==");
        }
      );
    },
    submitForm(e) {
      let query = JSON.parse(JSON.stringify(this.formData));
      let joinName = this.dict.type.sys_user_post_type.filter(i =>
        query.joinId.includes(i.value)
      );
      query.joinName = joinName.map(e => e.label).toString();
      query.joinId = query.joinId.toString();
      if (query.status != 'end') {
        query.status = e == 0 ? 'draft' : 'audit'
      }
      if (e == 0) {
        if (!this.formData.auditYear) {
          this.$message.warning("请先选择年度！");
          return;
        }
        if (this.formData.innerManagerAuditId != undefined) {
          updategmanagerAudit(query).then((response) => {
            this.$modal.msgSuccess("修改成功");
            this.resetForm();
          });
        } else {
          managerAuditAdd(query).then((response) => {
            this.$modal.msgSuccess("新增成功");
            this.resetForm();
          });
        }
        return
      }
      this.$refs["elForm"].validate((valid) => {
        if (valid) {

          if (this.formData.innerManagerAuditId != undefined) {
            updategmanagerAudit(query).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.resetForm();
            });
          } else {
            managerAuditAdd(query).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.resetForm();
            });
          }
        }
      });
    },
    resetForm() {
      this.$tab.closeOpenPage();
    },
  },
};
</script>
